<%@ include file="/common/taglibs.jsp"%>
<%@ page pageEncoding="UTF-8" contentType="text/html;charset=utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<!-- jquery -->
		<script src="${jquery}/jquery.js"></script>
		<script src="${jquery}/jquery.form.js"></script>
		<!-- colorbox -->
		<script type="text/javascript"
			src="${colorbox}/jquery.colorbox-min.js"></script>
		<link rel="stylesheet" type="text/css" href="${colorbox}/colorbox.css">
		<!-- easyui -->
		<script type="text/javascript" src="${easyui}/jquery.easyui.min.js"></script>
		<script type="text/javascript"
			src="${easyui}/locale/easyui-lang-zh_CN.js"></script>
		<link rel="stylesheet" type="text/css"
			href="${easyui}/themes/default/easyui.css">
		<!-- app -->
		<link rel="stylesheet" type="text/css" href="${app}/hnjz.css">
	</HEAD>

	<body>

		<form id="queryForm" method="post" action="roleQuery.json">
			<input type="hidden" id="fid" name="fid" value="${fid}" />
			<input type="hidden" id="page" name="page" value="${page}" />
			<input type="hidden" id="pageSize" name="pageSize"
				value="${pageSize}" />
			<div class="divContainer">
				<table width="100%" border="0" align="center" cellpadding="0"
					cellspacing="0" class="formtable">
					<tr>
						<td>
							<input class="i-text" type="text" id="name" name="name"
								value="${name}" />
							<span class="btn btn-ok"> <input id="query" type="submit"
									value="搜索"> </span>
							<a id="Add" href="editRole.htm" title="新建角色" class="btslink">新建</a>
							<a id="Edit" href="editRole.htm" title="编辑角色"></a>
						</td>
					</tr>
				</table>
			</div>
			<div class="divContainer" id="rolelist">
				<table id="test" fit="true"></table>
			</div>
		</form>

		<p>
	</body>
</HTML>
<SCRIPT LANGUAGE="JavaScript">
function edit(curObj){
	 $("#Edit").attr("href","editRole.htm?id="+curObj.id);
     $("#Edit").click();
}
function del(curObj){
	$.messager.confirm('角色管理', '确定要删除当前角色吗？', function(r){
		if (r){
			$.ajax({
			  url: "delRole.json?id="+curObj.id,
			  success:function(data){
	          	if(data.state){
		           ref();
		        }else{
		           $.messager.alert('删除角色:',data.msg);
		        }
			  }
			});
		}
	});

}
function ref(){
	jQuery().colorbox.close();
	$('#queryForm').submit();
}
$('#query').click(function(){
	$('#page').val("1");
});
$('#queryForm').submit(function(){
      $("#queryForm").ajaxSubmit({
     	  success: function(data){
     	      $('#test').datagrid('loadData',data)
	          initPager();
	      }
	 });
     return false;  
});
function initPager(){
    var p = $('#test').datagrid('getPager');
	$(p).pagination({
				onSelectPage:function(pageNumber, pageSize){
				    $('#page').val(pageNumber);
				    $('#pageSize').val(pageSize);
					$(this).pagination('loading');
					$('#queryForm').submit();
					$(this).pagination('loaded');
				}
	});
}
$(document).ready(function(){
	$("#rolelist").height($(window).height()-100);
	$("#Add").colorbox({iframe:true, width:"600", height:"400"});
	$("#Edit").colorbox({iframe:true, width:"600", height:"400"});
	$('#test').datagrid({
				nowrap: false,
				striped: true,
				collapsible:true,
				singleSelect:true,
				url:'roleQuery.json',
				onLoadSuccess:function(data){
      		    $(this).datagrid('doCellTip',{'max-width':'300px','delay':500});
                                    },
	            columns:[[
					{field:'jsname',title:'角色名称',width:100},
					{field:'description',title:'角色描述',width:100},
					{field:'operate',title:'操作',align:'center',width:100}
				]],
				pagination:true,
				rownumbers:true
	});
    initPager()
});
</SCRIPT>